<template>
  <div class="view-container">
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>专业课程体系查看</span>
      </div>
      <el-table :data="courses" style="width: 100%" stripe border>
        <el-table-column prop="name" label="课程名称" align="center" />
        <el-table-column prop="type" label="课程类型" align="center" />
        <el-table-column prop="semester" label="建议学期" align="center" />
      </el-table>
    </el-card>
  </div>
</template>

<script>
export default {
  data() {
    return {
      courses: [
        { name: '高等数学', type: '必修', semester: '第1学期' },
        { name: '线性代数', type: '必修', semester: '第2学期' },
        { name: '概率论与数理统计', type: '必修', semester: '第3学期' },
        { name: '离散数学', type: '必修', semester: '第4学期' },
        { name: '计算机导论', type: '必修', semester: '第1学期' },
        { name: '程序设计基础', type: '必修', semester: '第2学期' },
        { name: '数据结构', type: '必修', semester: '第3学期' },
        { name: '算法设计与分析', type: '必修', semester: '第4学期' },
        { name: '操作系统', type: '必修', semester: '第5学期' },
        { name: '计算机网络', type: '必修', semester: '第6学期' },
        { name: '数据库原理', type: '选修', semester: '第5学期' },
        { name: '软件工程', type: '选修', semester: '第6学期' },
        { name: '人工智能导论', type: '选修', semester: '第7学期' },
        { name: '机器学习', type: '选修', semester: '第8学期' },
        { name: '计算机图形学', type: '选修', semester: '第7学期' },
        { name: '编译原理', type: '选修', semester: '第8学期' },
        { name: '计算机组成原理', type: '必修', semester: '第5学期' },
        { name: '嵌入式系统', type: '选修', semester: '第6学期' },
        { name: '网络安全', type: '选修', semester: '第7学期' },
        { name: '云计算', type: '选修', semester: '第8学期' }
      ]
    }
  }
}
</script>

<style scoped>
.view-container {
  padding: 20px;
}

.box-card {
  max-width: 800px;
  margin: 0 auto;
}
</style>
